.markdown-editor {
  height: 100%;
  width: 100%;
  &-toolbar {
    padding: .5rem;
    box-sizing: border-box;
    background: #f5f5f5;
    border-top-left-radius: .5rem;
    border-top-right-radius: .5rem;
    border-bottom: thin solid #dcdcdc;
    button {
      background: none;
      border: none;
      cursor: pointer;
      padding: 0;
      .toolbar-icon {
        text-align: center;
        border-radius: 5px;
        transition: all .35s;
        span {
          padding: .25rem .2rem;
          font-weight: bold;
          box-sizing: border-box;
        }
        .fa {
          padding: .4rem;
          box-sizing: border-box;
        }
        width: 1rem;
        height: 1rem;
        border: thin solid transparent;
        color: #484848;
        &:hover {
          background: gainsboro;
          border-color: gray;
          color: blue;
        }
      }
      & + button {
        margin-left: .2rem;
      }
    }
  }
  &-ace {
    font: {
      family: Consolas, 'Microsoft YaHei', sans-serif;
      size: 1rem;
    }
    border-right: thin solid gray;
  }
}

.dialog-font-awesome {
  height: 100%;
  width: 100%;
  overflow: auto;
  table {
    width: 100%;
    border-collapse: collapse;
  }
  td {
    border: thin solid gray;
    text-align: center;
  }
  button {
    display: inline-block;
    padding: .3rem 0;
    border: thin solid #cdcdcd;
    width: 3rem;
    height: 3rem;
    font-size: 1.5rem;
    transition: background-color .35s;
    &:hover {
      background: #ededed;
    }
  }
}

.toolbar-decollator {
  color: #d0d0d0;
}

ol.linenums {
  margin-bottom: 0;
  li {
    list-style-type: decimal;
  }
}

.markdown-body {
  box-sizing: border-box;
  min-width: 200px;
  max-width: 980px;
  margin: 0 auto;
  padding: 45px;
  overflow: auto;
}

.markdown-body, .ace_scrollbar {
  &::-webkit-scrollbar {
    width: .4rem;
    height: .4rem;
    border-radius: .2rem;
    background: rgb(216, 216, 216);
  }
  &::-webkit-scrollbar-thumb {
    border-radius: .2rem;
    background: rgb(138, 138, 138)
  }
}

@media (max-width: 767px) {
  .markdown-body {
    padding: 15px;
  }
}